<template>
  <div style='background: none;'>
    <a-result
      status='success'
    >
      <template #title>
        评分成功
      </template>
      
      <a-descriptions
        style='margin-bottom: 50px;'
        title='判题信息'
        layout='vertical'
        bordered>
        <a-descriptions-item label='判题人'>
          {{ judger }}
        </a-descriptions-item>
        <a-descriptions-item label='提交时间'>
          <a> {{ subTime }} </a>
        </a-descriptions-item>
        <a-descriptions-item label='判题总分'>
          <a>{{ totalScore }} </a>
        </a-descriptions-item>
      </a-descriptions>
      
      <a-divider><h2>判题得分详情</h2></a-divider>
      
      <a-table :columns='columns'
               bordered
               rowKey='replyId'
               :data-source='judgeScoreList'>
        
        <!--题目编号-->
        <span
          slot='replyId'
          slot-scope='replyId'>
          {{ replyId }}
      </span>
        
        <!--题目名称-->
        <span slot-scope='title'>
        <a-icon type='smile-o' /> {{ title }}
      </span>
        
        <!--分数-->
        <span
          slot='score'
          slot-scope='score'>
          {{ score }}
      </span>
      
      </a-table>
      
      
      <template #extra>
        <a-button
          key='console'
          @click='close()'
          type='primary'>
          关闭页面
        </a-button>
        <a-button
          @click='close()'
          key='buy'>
          回到判题页
        </a-button>
      </template>
    </a-result>
  </div>
</template>


<script>
const columns = [
  {
    title: '答题编号',
    dataIndex: 'replyId',
    width: '15%',
    scopedSlots: { customRender: 'replyId' }
  },
  {
    title: '题目名称',
    dataIndex: 'title',
    width: '15%',
    scopedSlots: { customRender: 'title' }
  },
  {
    title: '分数',
    dataIndex: 'score',
    width: '15%',
    scopedSlots: { customRender: 'score' },
    sorter: (a, b) => a.score - b.score
  }
]
export default {
  name: 'JudgeResult',
  props: {
    judger: {
      type: String,
      required: false
    },
    subTime: {
      type: String,
      required: false
    },
    judgeScoreList: {
      type: Array,
      required: false
    },
    totalScore: {
      type: Number,
      required: false
    }
  },
  data() {
    return {
      // 列数据
      columns
    }
  },
  methods: {
    close() {
      window.close()
    }
  }
}
</script>

<style scoped>

</style>